/**
 * 物业消息
 * @author truexin
 * @date   2016/05/30
 */

import PullRefresh from '../components/mui/PullRefresh.js';
import NoData from '../components/NoData.js';

(function (lf, r) {

    var ajax = lf.utils.ajax,
        fmt = 'yyyy-MM-dd hh:mm',
        doAction = lf.bridgeJs.doAction,
        getUrlParam = lf.utils.getUrlParam,
        houseNum = '',
        RC = r.createClass;

    var System = RC({
        componentDidMount: function () {
            var toDetail = r.findDOMNode(this.refs.system);
            var me = this;
            var data = me.props.data,
                user = me.props.user,
                userId = data.userId,
                businessType = data.businessType,
                businessId = data.businessId,
                feeNoticeDetailId = getUrlParam('feeNoticeDetailId', data.pageUrl);

            $(toDetail).on('tap', function () {
                if (!businessType) {
                    doAction('finger-quene-dynamic.html', '入住办理');
                }
                if (businessType == '010') {//物业须知
                    ajax({
                        type: "get",
                        data: {
                            id: businessId
                        },
                        success: function (data) {
                            ajax({
                                type: "POST",
                                data: {
                                    userType: user.householdType,
                                    userId: user.id,
                                    noticeId: businessId
                                },
                                success: function () {
                                    console.log('you are browsing...物业须知');
                                }
                            }, lf.finger.api.property.saveNoticeBrowse);

                            var title = data.data.title;
                            ajax({
                                type: "post",
                                data: {
                                    businessId: businessId,
                                    userId: userId,
                                },
                                success: function () {
                                    doAction('property-instructions-detail.html?id=' + businessId, title);
                                }
                            }, lf.finger.api.message.updateById)
                        }.bind(me)
                    }, lf.finger.api.property.getProjectNotice)
                } else if (businessType == '020' || businessType == '018') {//费用通知     =》原来是018,注意旧数据哦
                    ajax({
                        type: "POST",
                        data: {
                            userType: user.householdType,
                            userId: user.id,
                            noticeId: businessId
                        },
                        success: function () {
                            ajax({
                                type: "post",
                                data: {
                                    userId: userId,
                                    businessId: businessId,
                                },
                                success: function () {
                                    doAction('property-fee-query.html?feeNoticeDetailId=' + feeNoticeDetailId, '费用查询');
                                }
                            }, lf.finger.api.message.updateById)
                        }
                    }, lf.finger.api.property.saveNoticeBrowse)
                } else {
                    ajax({
                        type: "get",
                        data: {
                            noticeId: businessId
                        },
                        success: function (data) {
                            ajax({
                                type: "POST",
                                data: {
                                    userType: user.householdType,
                                    userId: user.id,
                                    noticeId: businessId
                                },
                                success: function () {
                                    console.log('you are browsing...other');
                                }
                            }, lf.finger.api.property.saveNoticeBrowse);

                            var title = data.data.title;
                            ajax({
                                type: "post",
                                data: {
                                    userId: userId,
                                    businessId: businessId,
                                },
                                success: function () {
                                    doAction('property-notice-intro.html?noticeId=' + businessId, title);
                                }
                            }, lf.finger.api.message.updateById)
                        }.bind(me)
                    }, lf.finger.api.property.getNotice)
                }


            }.bind(me))

        },
        render: function () {
            var data = this.props.data,
                createTime = lf.utils.format(data.createTime, fmt);
            var tips = '',
                blue = '';
            if (data.status == '1') {
                tips = '未查看';
            } else if (data.status == '2') {
                tips = '已查看';
                blue = 'blue';
            }
            return (
                <div className='system-content' ref="system" onTouchEnd={this.clickFn}>
                    <span className='lf sys'>
                         <i className={blue}>{tips}</i>
                    </span>
                    <b>{createTime}</b>
                    <span className="head-img">
                    </span>
                    <p className="content text-dot"> {data.title}</p>
                    <a href="#" className="detail">查看详情</a>
                </div>
            )
        }
    });

    var Body = RC({
        getInitialState: function () {
            return ({
                list: [],
                user: [],
                itemList: []
            })
        },
        componentWillMount: function () {
            var me = this;
            var page = this.props.page;
            lf.bridgeJs.getUser(function (user) {
                me.getHouseId(user, page);
                me.setState({
                    user: user,
                });
                lf.appJs.refresh();
            })
        },
        getHouseId: function (user, page) {
            var me = this;
            if (user.houseId) {
                ajax({
                    type: 'get',
                    data: {
                        houseId: user.houseId,
                    },
                    success: function (data) {
                        houseNum = data.data.houseNum;
                        me.getList(user, houseNum, page);
                    }.bind(me)
                }, lf.finger.api.household.getHouseInfo);
            } else {
                ajax({
                    type: 'get',
                    data: {
                        globalId: user.globalId,
                    },
                    success: function (data) {
                        houseNum = data.dataList[0].houseNum;
                        me.getList(user, houseNum, page);
                    }.bind(me)
                }, lf.finger.api.household.getHouseList);
            }
        },
        getList: function (user, houseNum, page) {
            var me = this;
            ajax({
                type: 'post',
                data: {
                    userId: user.userId,
                    projectId: user.projectId,
                    houseNum: houseNum,
                    page: page,

                },
                success: function (data) {
                    if (data.code == '200') {
                        if (!data.dataList.length) {

                        } else {
                            let itemList = me.state.itemList;
                            let resultList = data.dataList;
                            $.each(resultList, function (i, item) {
                                itemList.push(item);
                            });

                            mui('#pullrefresh')
                                .pullRefresh()
                                .endPullupToRefresh((itemList.length == data.maxCount)); //refresh completed

                            me.setState({
                                itemList: itemList
                            })

                            var list = itemList.map(function (data) {
                                return (
                                    <System key={data.id} data={data} user={user}/>
                                )
                            });
                            me.setState({list: list});
                        }
                    }
                    else {
                        alert(data.desc);
                    }
                }.bind(me)
            }, lf.finger.api.message.sysMsg);
        },
        componentWillReceiveProps: function (nextProps) {
            var page = nextProps.page;
            this.getHouseId(this.state.user, page)
        },
        componentDidMount: function () {
            var node = r.findDOMNode(this.refs.defaultNode);
            var page = r.findDOMNode(this.refs.defaultPage);
            $(node).css({borderBottom: '5px solid #00beca'});//已经激活样式
            $(page).prev().css({display: 'none'});//隐藏未激活项
        },
        clickFn: function (e) {
            var me = this;
            var node = e.target;
            var showActive = function (node) {
                var header = r.findDOMNode(me.refs.clickHeader);
                var pages = $('.page');
                var links = $(header).find('a');
                for (var i = 0; i < links.length; i++) {
                    if (links[i] != node) {
                        $(links[i]).css({borderBottom: '5px solid #ccc'});
                        $(pages[i]).css({display: 'none'});
                        $(pages[i - 1]).css({display: 'block'});
                    } else {
                        $(node).css({borderBottom: '5px solid #00beca'});//已经激活样式
                        $(pages[i]).css({display: 'block'});
                        $(pages[i - 1]).css({display: 'none'});
                    }
                }
            };
            showActive(node);
        },
        render: function () {
            return (
                <div className="property-msg">
                    <div className="item-row" ref="clickHeader">
                        <div className="item">
                            <a onTouchStart={this.clickFn}>
                                个人
                            </a>
                        </div>
                        <div className="item">
                            <a ref="defaultNode" className="active-btn" onTouchStart={this.clickFn}>
                                系统
                            </a>
                        </div>
                    </div>



                    <div className="page" id="p1">
                        <center>暂无消息</center>
                    </div>
                    <div className="page" ref="defaultPage">
                        {this.state.list}
                    </div>
                </div>
            );
        }
    });

    const PullRefreshCon = RC({
        getInitialState() {
            return {
                page: 1
            }
        },
        pullupFn: function () {
            let newPage = ++this.state.page;
            this.setState({page: newPage});
        },
        render() {
            var me = this;
            return <PullRefresh pullupFn={me.pullupFn} data={<Body page={me.state.page}/>}/>;
        }
    });


    r.render(
        <PullRefreshCon/>,
        document.getElementById('root'), function () {

        }
    )


})(liefeng, React)
